/*
 * Copyright 2019 Google LLC
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

[hidden] {
  display: none !important;
}

.access-denied-remark {
  color: #888;
  font-style: italic;
}

#mainMenu paper-item {
  display: block;
  cursor: pointer;
  text-decoration: none;
  display: block;
  line-height: 50px;
}

#mainMenu a {
  display: block;
  text-decoration: none;
  color: #444;
}

#mainMenu a:hover {
  text-decoration: none;
  background-color: #f2f7fa;
}

app-drawer #contentContainer {
  background-color: #f2f7fa;
}

app-toolbar {
  min-width: 1200px;
  background-color: #373b50;
  color: #ffffff;
  position: relative;
}

app-toolbar paper-spinner {
  position: absolute;
  top: 18px;
  right: 15px;
}

.drawer-toolbar {
  display: block;
  background-color: #373b50;
  height: 64px;
  line-height: 64px;
}

.drawer-toolbar a, .drawer-toolbar a:hover, .drawer-toolbar a:visited {
  color: #fff;
  text-decoration: none;
}

.drawer-toolbar iron-icon {
  margin-bottom: 3px;
  margin-left: 25px;
}

app-toolbar .home {
  font-weight: bold;
  vertical-align: middle;
  text-decoration: none;
  line-height: 30px;
  outline-width: 0;
  color: #fff;
}

app-toolbar .home iron-icon {
  margin-bottom: 4px;
}

#title {
  width: 100%;
  text-align: center;
  font-size: 18px;
}

#mainContent {
  min-width: 1200px;
  max-width: 1600px;
  width: 90%;
  margin: 20px auto;
  overflow: visible;
}

#left-column {
  width: 700px;
  display: inline-block;
  margin: 0px;
  padding: 0px 5px;
  vertical-align: top;
}

#right-column {
  width: 234px;
  display: inline-block;
  margin: 0px;
  padding: 0px 5px;
  vertical-align: top;
}

paper-button.small {
  font-size: 13px;
  min-width: 0px;
  padding: 0.4em 0.2em;
}

#redoPanel paper-checkbox {
  display: block;
  margin: 5px 15px;
}

#right-column .panel .body paper-button {
  display: block;
  margin: 10px;
  text-align: center;
}

#deleteButton {
  display: block;
  margin-top: 20px;
  text-align: center;
}

.tools {
  display: block;
  margin: 5px 0px;
}

.tools table {
  width: 100%;
}


.tools tr td:last-child {
  text-align: right;
}

.update-issue-button {
  padding: 0px;
  width: 16px;
  height: 16px;
}

.section {
  display: block;
  margin-bottom: 10px;
  padding: 0px;
  background-color: #f2f7fa;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
  overflow: visible;
}

.section > .title {
  display: block;
  font-size: 14px;
  padding: 4px 6px;
  background-color: #373b50;
  text-transform: uppercase;
  color: #fff;
}

.section > .body {
  display: block;
  font-size: 14px;
}

.section > .body.padding {
  padding: 4px 6px;
}

.pre-line {
  white-space: pre-line;
}

.section > .body > table {
  width: 100%;
  margin-top: 3px;
}

.section > .body > table td {
  vertical-align: top;
  padding: 4px 3px;
  font-size: 14px;
  line-height: 24px;
}

.section > .body > table td.label {
  text-align: right;
  color: #979a95;
  font-size: 14px;
}

.section > .body > table td.label > .help, .artifacts .title > .help {
  cursor: help;
  color: #979a95;
  font-size: 14px;
  text-decoration: none;
}

.section > .body > table td.value .help {
  cursor: help;
  text-decoration: none;
}

.section > .body > table.overview td {
  vertical-align: top;
  padding: 4px 3px;
}

.section > .body > table.overview td.label {
  white-space: nowrap;
}

.section > .body > table.overview td.label.crash-state {
  width: 120px;
}

.section > .body > table.overview td.value.crash-state div {
  font-family: 'Source Code Pro', monospace;
  font-size: 14px;
  line-height: 17px;
  margin-top: 4px;
  overflow: hidden;
  white-space: nowrap;
  display: block;
}

.section > .body > .artifacts {
  margin-top: 10px;
  display: block;
  width: 100%;
}

.section > .body > .artifacts > div {
  display: inline-block;
  padding: 2px 6px;
  font-size: 14px;
  line-height: 24px;
  border-radius: 4px;
  margin: 5px;
}

.section > .body > .artifacts > div .title {
  text-align: left;
  color: #979a95;
  white-space: nowrap;
}

.section > .body > .artifacts > div .content {
  text-align: left;
  padding-left: 2px;
}

.section > .body > .artifacts > div iron-icon {
  height: 20px;
  width: 20px;
  margin: 0px 1px;
}

.section > table.revision {
  width: 100%;
}

.section > table.revision tr.title td {
  width: 33%;
  text-align: left;
  text-transform: uppercase;
  font-size: 14px;
  padding: 4px 6px;
  background-color: #fecea8;
  color: #4c3e32;
  border-left: 1px dotted #4c3e32;
}

.section > table.revision tr.title td:first-child {
  border-left: 0px;
}

.section > table.revision tr.body td {
  width: 33%;
  padding: 4px 6px;
  border-left: 1px dotted #ccc;
  font-size: 13px;
  vertical-align: top;
}

.section > table.revision tr.body td:first-child {
  border-left: 0px;
}


.section > .body > table.reproduction {
  width: 100%
}

.section > .body > table.reproduction tr td:first-child {
  text-align: right;
  color: #fecea8;
  font-size: 14px;
  line-height: 20px;
  width: 25%
}

.section > .body > table.reproduction tr td:last-child {
}

.section > .body > table.reproduction tr td:last-child small {
  text-transform: none;
  font-size: 12px;
}

.section > .body > .group {
  width: 100%;
}

.section > .body > .group tr td {
  vertical-align: top;
}

.section > .body > .group tr td:first-child {
  text-align: right;
  width: 18%;
  font-size: 14px;
  line-height: 20px;
  color: #fecea8;
}

.section > .body > .group tr td:first-child a {
  color: #fecea8;
}

.section > .body > .group tr td:first-child small a {
  font-size: 11px;
  color: #999;
  margin-right: 5px;
}

.section > .body > .group tr td:last-child {
  font-size: 13px;
  line-height: 20px;
  font-family: 'Source Code Pro', monospace;
}

paper-spinner {
  --paper-spinner-layer-1-color: #3ea1e6;
  --paper-spinner-layer-2-color: #3ea1e6;
  --paper-spinner-layer-3-color: #3ea1e6;
  --paper-spinner-layer-4-color: #3ea1e6;
}

.google-visualization-table>div:first-child {
  overflow: visible !important;
}

.google-visualization-table-table {
  font: inherit !important;
  margin: 0px 10px 10px !important;
  @apply(--shadow-elevation-2dp);
}

.search-box {
  padding-left: 10px;
  width: 400px;
}

.search-box iron-icon[slot="prefix"] {
  margin-right: 5px;
  color: #888;
  height: 22px;
  width: 22px;
}

.search-box iron-icon[slot="suffix"] {
  color: #888;
  height: 16px;
  width: 16px;
}

.flex {
  @apply --layout-horizontal;
  border-bottom: 1px solid #ccc;
  width: 100%;
}